 {% load staticfiles %}
<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
    <title>Bootstrap 101 Template</title>

    <!-- Bootstrap -->
    <link href="{% static '' %}default/css/bootstrap.min.css" rel="stylesheet">
      <link href="{% static '' %}default/css/style.css" rel="stylesheet">

    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
      <script src="//cdn.bootcss.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="//cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
  </head>
  <body>
{% include 'default/block_nav.html' %}


<div class="container theme-showcase" role="main">


      <div class="page-header">
        <h1>物流监控设置 </h1>
      </div>
      <div class="row">
        <div class="col-md-8">

            <form action="" method="POST">
            {% csrf_token %}
                <table class="table ">
                    <thead>
                    <tr>
                        <th>预警提醒天数</th>
                        <th>异常提醒天数</th>
                        <th>－</th>
                    </tr>
                    <tr>
                        <td style="width: 120px;text-align: center;">
                            <div class="input-group">
                              <span class="input-group-addon numReduce">-</span>
                              <input type="text" class="form-control" name="wuliu_yujing" {% if user_profile.wuliu_yujing %}value="{{ user_profile.wuliu_yujing }}"{% endif %} onkeyup="this.value=this.value.replace(/\D/g,'')" onafterpaste="this.value=this.value.replace(/\D/g,'')">
                              <span class="input-group-addon numAdd">+</span>
                            </div>
                        </td>
                        <td style="width: 120px;text-align: center;">
                            <div class="input-group">
                              <span class="input-group-addon numReduce">-</span>
                              <input type="text" class="form-control" name="wuliu_yichang" {% if user_profile.wuliu_yichang %}value="{{ user_profile.wuliu_yichang }}"{% endif %} onkeyup="this.value=this.value.replace(/\D/g,'')" onafterpaste="this.value=this.value.replace(/\D/g,'')">
                              <span class="input-group-addon numAdd">+</span>
                            </div>
                        </td>
                       <td style="width: 180px;text-align: center;">
                            <button class="btn btn-xs btn-success">保 存</button>
                        </td>
                        </td>
                    </tr>
                    </thead>
                </table>
            </form>

        <div class="page-header">
        <h3>渠道&国家调控设置</h3>
      </div>

                <table class="table">
                    <thead>
                    <tr>
                        <th>物流渠道</th>
                        <th>国家</th>
                        <th>平均签收时间</th>
                        <th>调控数值</th>
                        <th>－</th>
                    </tr>
                    </thead>
                    <tbody>
                    {% for l in ls %}
                        <tr>
                        <td>{{ l.channel }}</td>
                        <td>{{ l.country }}</td>
                        <td style="text-align: center;">{{ l.average }}</td>
                        <td style="width: 120px;text-align: center;">
                            <div class="input-group">
                              <span class="input-group-addon numReduce">-</span>
                              <input type="text" class="form-control" old-data="{{ l.regulation }}" {% if l.regulation %}value="{{ l.regulation }}"{% endif %} id="num-{{ l.id }}">
                              <span class="input-group-addon numAdd">+</span>
                            </div>
                        </td>
                        <td style="width: 180px;text-align: center;">
                            <button class="btn btn-xs btn-success" onclick="save('{{ l.id }}')">保 存</button>
                            <button class="btn btn-xs btn-danger">删 除</button>
                        </td>
                    </tr>
                    {% endfor %}
                    </tbody>
                </table>

            <button class="btn btn-xs btn-primary" data-toggle="modal" data-target="#myModal">添加</button>

            <div style="margin-bottom: 15px;"></div>


            <div class="jumbotron">
              <p>调控值说明。</p>
            </div>

        </div>



    </div>
</div>
    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="//cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="{% static '' %}default/js/bootstrap.min.js"></script>
  <script>

  </script>
  {% include 'default/tongji.html' %}



  <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
        <h4 class="modal-title" id="myModalLabel">添加物流监控配置</h4>
      </div>
      <div class="modal-body">
          <form class="form-horizontal" role="form" action="" method="POST">
              {% csrf_token %}
									<div class="form-group">
										<label for="inputWuliu" class="col-sm-2 control-label">物流渠道</label>
										<div class="col-sm-10">
											<input type="text" class="form-control" id="inputWuliu" name="inputWuliu" placeholder="物流渠道名称" style="display: none;">

                                            <select name="channelSelect" id="channelSelect">
                                                {% for c in channels %}
                                                <option value="{{ c.Channel }}">{{ c.Channel }} - {{ c.Count }}</option>
                                                {% endfor %}
                                            </select>
                                        <lable> <i class="glyphicon glyphicon-plus addChannel"></i></lable>
                                        </div>
									</div>
									<div class="form-group">
										<label for="inputCountry" class="col-sm-2 control-label">国家名称</label>
										<div class="col-sm-10">
											<input type="text" class="form-control" id="inputCountry" name="inputCountry" placeholder="国家中文名称" style="display: none;">
                                            <select name="countrylSelect" id="countrylSelect">
                                                {% for d in countrys %}
                                                <option value="{{ d.Destination }}">{{ d.Destination }} - {{ d.Count }}</option>
                                                {% endfor %}
                                            </select>
                                        <lable><i class="glyphicon glyphicon-plus addDestination"></i></lable>

                                        </div>
									</div>
                                    <div class="form-group">
										<label for="inputRegulation" class="col-sm-2 control-label">调控数值</label>
										<div class="col-sm-10">
											<input type="text" class="form-control" id="inputRegulation" name="inputRegulation" placeholder="" onkeyup="this.value=this.value.replace(/\D/g,'')" onafterpaste="this.value=this.value.replace(/\D/g,'')" ></div>
									</div>

									<div class="form-group">
										<div class="col-sm-offset-2 col-sm-10">
                                            <button type="reset" class="btn btn-info">重  置</button>
											<button type="submit" class="btn btn-primary">提  交</button>

										</div>
									</div>
								</form>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
      </div>
    </div>
  </div>
</div>

<script type="text/javascript">

    $('#inputCountry').val($('#countrylSelect').val());
    $('#inputWuliu').val($('#channelSelect').val());

    $('.addChannel').click(function(){
         $(this).removeClass('glyphicon-plus addChannel');
         $(this).addClass('glyphicon-minus channelHide');
         //$(this).css('display','none');
        $('#inputWuliu').css('display','block');
    });
    $('.addDestination').click(function(){
        $(this).removeClass('glyphicon-plus addDestination');
        $(this).addClass('glyphicon-minus countryHide');
        $('#inputCountry').css('display','block');
    });
    $('#countrylSelect').change(function(){
        var d = $(this).children('option:selected').val();
        $('#inputCountry').val(d);
    });
    $('#channelSelect').change(function(){
        var c = $(this).children('option:selected').val();
        $('#inputWuliu').val(c);
    });

    $('.numAdd').click(function(){
        var num = $(this).parent().children('input').val();
        if(num>=60){
            alert('最大数值为60');
            $(this).parent().children('input').val(60);
        }else{
            $(this).parent().children('input').val(parseInt(num)+1);
        }
    });
    $('.numReduce').click(function(){
        var num = $(this).parent().children('input').val();
        if(num<=1){
            alert('最小数值为1');
            $(this).parent().children('input').val(1);
        }else{
            $(this).parent().children('input').val(parseInt(num)-1);
        }
    });
    function save(id){
        var num = $('#num-'+id).val();
        var old = $('#num-'+id).attr('old-data');
        if(old!=num){
            $.get('/api/save_ls/',{'id':id,'num':num},function(data){
                if(data=='1'){
                    alert('保存成功');
                    //window.location='';
                }else if(data=='0'){
                    alert('保存失败');
                    return false;
                }
            });
            }
    }
</script>


  </body>
</html>